<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <META HTTP-EQUIV="pragma" CONTENT="no-cache">
    <META HTTP-EQUIV="Cache-Control" CONTENT="no-cache, must-revalidate">
    <META HTTP-EQUIV="expires" CONTENT="0">
    <link rel="stylesheet" href="../../layui/css/layui.css?v=1" media="all">
    <script src="../../js/jquery/3.5.1/jquery.js?v=1"></script>
    <script src="../../layui/layui.js?v=1" charset="utf-8"></script>
    <script src="../../js/config.js?v=1"></script>
    <script src="../../js/public.js?v=1"></script>
    <script src="../../js/function.js?v=1"></script>
    <link rel="stylesheet" href="../../css/public.css?v=1">
    <link rel="stylesheet" href="../../css/patient/patient_info.css?v=1">
    <style>
        .add-container {
            min-height: 700px;
        }
    </style>
</head>

<body>
    <div class="container">
        <div class="table-title">
            <ul class="table-title-tab">
                <li class="tab-curr">
                    <p>基本信息</p>
                    <p class="complete_basic">0%</p>
                </li>
                <li>
                    <a href="./qss/qss1.html">
                        <p>病历采集</p>
                        <p class="complete_qss">0%</p>
                    </a>
                </li>
                <li>
                    <a href="./qss/qss7.html">
                        <p>检查信息</p>
                        <p style="display: none;">0%</p>
                    </a>
                </li>
                <div class="clear"></div>
            </ul>
        </div>
        <div class="add-container">
            <div class="baseinfo-box">
                <form class="layui-form">

                    <div class="baseinfo-box-title">
                        <p>基本信息</p>
                    </div>
                    <div class="baseinfo-item">
                        <div class="layui-form-item layui-inline">
                            <div class="layui-form-label">患者姓名</div>
                            <div class="layui-input-inline">
                                <input type="text" name="name" class="layui-input" placeholder="请输入患者姓名">
                            </div>
                        </div>
                        <div class="layui-form-item layui-inline">
                            <div class="layui-form-label" style="letter-spacing: 25px;text-align: center;">性别</div>
                            <div class="layui-input-inline">
                                <button class="sex-btn sex-checkbox" type="button" data-val="0">男</button>
                                <button class="sex-btn sex-checkbox" type="button" data-val="1">女</button>
                                <input type="hidden" name="sex">
                            </div>
                        </div>
                        <div class="clear"></div>
                    </div>
                    <div class="baseinfo-item">
                        <div class="layui-form-item layui-inline">
                            <div class="layui-form-label">出生日期</div>
                            <div class="layui-input-inline">
                                <input type="text" class="layui-input" name="bday" id="bday" placeholder="请选择出生日期" autocomplete="off">
                            </div>
                        </div>
                        <div class="layui-form-item layui-inline">
                            <div class="layui-form-label" style="letter-spacing: 25px;text-align: center;">民族</div>
                            <div class="layui-input-inline">
                                <select name="ethnicity">
                                <option value="">请选择</option>
                                <option value="汉族">汉族</option>
                                <option value="蒙古族">蒙古族</option>
                                <option value="回族">回族</option>
                                <option value="藏族">藏族</option>
                                <option value="维吾尔族">维吾尔族</option>
                                <option value="苗族">苗族</option>
                                <option value="彝族">彝族</option>
                                <option value="壮族">壮族</option>
                                <option value="布依族">布依族</option>
                                <option value="朝鲜族">朝鲜族</option>
                                <option value="满族">满族</option>
                                <option value="侗族">侗族</option>
                                <option value="瑶族">瑶族</option>
                                <option value="白族">白族</option>
                                <option value="土家族">土家族</option>
                                <option value="哈尼族">哈尼族</option>
                                <option value="哈萨克族">哈萨克族</option>
                                <option value="傣族">傣族</option>
                                <option value="黎族">黎族</option>
                                <option value="僳僳族">僳僳族</option>
                                <option value="佤族">佤族</option>
                                <option value="畲族">畲族</option>
                                <option value="高山族">高山族</option>
                                <option value="拉祜族">拉祜族</option>
                                <option value="水族">水族</option>
                                <option value="东乡族">东乡族</option>
                                <option value="纳西族">纳西族</option>
                                <option value="景颇族">景颇族</option>
                                <option value="柯尔克孜族">柯尔克孜族</option>
                                <option value="土族">土族</option>
                                <option value="达斡尔族">达斡尔族</option>
                                <option value="仫佬族">仫佬族</option>
                                <option value="羌族">羌族</option>
                                <option value="布朗族">布朗族</option>
                                <option value="撒拉族">撒拉族</option>
                                <option value="毛南族">毛南族</option>
                                <option value="仡佬族">仡佬族</option>
                                <option value="锡伯族">锡伯族</option>
                                <option value="阿昌族">阿昌族</option>
                                <option value="普米族">普米族</option>
                                <option value="塔吉克族">塔吉克族</option>
                                <option value="怒族">怒族</option>
                                <option value="乌孜别克族">乌孜别克族</option>
                                <option value="俄罗斯族">俄罗斯族</option>
                                <option value=鄂温克族"">鄂温克族</option>
                                <option value="德昂族">德昂族</option>
                                <option value="保安族">保安族</option>
                                <option value="裕固族">裕固族</option>
                                <option value="京族">京族</option>
                                <option value="塔塔尔族">塔塔尔族</option>
                                <option value="独龙族">独龙族</option>
                                <option value="鄂伦春族">鄂伦春族</option>
                                <option value="赫哲族">赫哲族</option>
                                <option value="门巴族">门巴族</option>
                                <option value="珞巴族">珞巴族</option>
                                <option value="基诺族">基诺族</option>
                            </select>
                            </div>
                        </div>
                        <div class="clear"></div>
                    </div>
                    <div class="baseinfo-item">
                        <div class="layui-form-item layui-inline">
                            <div class="layui-form-label">身份证号</div>
                            <div class="layui-input-inline">
                                <input type="text" name="sfzid" class="layui-input" placeholder="请输入身份证号">
                            </div>
                        </div>
                        <div class="layui-form-item layui-inline">
                            <div class="layui-form-label" style="letter-spacing: 25px;text-align: center;">籍贯</div>
                            <div class="layui-input-inline">
                                <!--<input type="text" class="layui-input" name="birthplace" placeholder="请输入籍贯">-->
                                <select class="layui-select birthplace" name="ancestral_home"></select>
                            </div>
                        </div>
                        <div class="clear"></div>
                    </div>
                    <div class="baseinfo-item">
                        <div class="layui-form-item layui-inline">
                            <div class="layui-form-label">联系手机</div>
                            <div class="layui-input-inline">
                                <input type="text" class="layui-input" name="cell" placeholder="请输入手机号" disabled>
                            </div>
                        </div>
                        <!--<div class="layui-form-item layui-inline">
                        <div class="layui-input-inline">
                            <input type="text" class="layui-input" placeholder="请输入验证码">
                        </div>
                    </div>-->
                        <div class="layui-form-item layui-inline">
                            <div class="layui-input-inline">
                                <button class="get-code" id="edit_mobile" type="button">点击修改</button>
                            </div>
                        </div>
                        <div class="clear"></div>
                    </div>
                    <div class="baseinfo-item">
                        <div class="layui-form-item layui-inline">
                            <div class="layui-form-label" style="width:180px;">家庭成员有无垂体疾病？</div>
                            <div class="layui-input-inline">
                                <button class="family_like_has" type="button" data-val="1">有</button>
                                <button class="family_like_has" type="button" data-val="0">无</button>
                                <input type="hidden" name="family_like_has">
                                </button>
                            </div>
                            <div class="layui-input-inline family_like_has_type_name" style="display: none;">
                                <input type="text" class="layui-input" name="family_like_has_type_name">
                            </div>
                            <div class="clear"></div>
                        </div>

                    </div>
                    <div class="baseinfo-box-title">
                        <p>垂体疾病类型</p>
                    </div>
                    <div class="baseinfo-box-title" style="font-size:14px;color:#333333;">
                        <p>关于垂体疾病描述符合以下哪条？</p>
                    </div>
                    <div class="baseinfo-item">
                        <div class="layui-form-item">
                            <div class="layui-form-label">a.是否诊断为垂体瘤</div>
                            <div class="layui-input-inline" style="float:right;margin-right:200px;">
                                <button class="is_chuiti" type="button" data-val="1">是</button>
                                <button class="is_chuiti" type="button" data-val="0">否</button>
                                <input type="hidden" name="has_chuiti">
                            </div>
                        </div>
                    </div>
                    <div class="has-pituitary" style="display:none;">
                        <div class="baseinfo-item">
                            <div class="layui-form-item">
                                <div class="layui-form-label">b.垂体瘤功能状态：</div>
                            </div>
                        </div>
                        <div class="baseinfo-item">
                            <div class="layui-form-item">
                                <input type="checkbox" name="types" lay-skin="primary" title="无功能瘤" value="1">
                                <input type="checkbox" name="types" lay-skin="primary" title="GH瘤" value="2">
                                <input type="checkbox" name="types" lay-skin="primary" title="PRL瘤" value="3">
                                <input type="checkbox" name="types" lay-skin="primary" title="ACTH瘤" value="4">
                                <input type="checkbox" name="types" lay-skin="primary" title="TSH瘤" value="5">
                                <input type="checkbox" name="types" lay-skin="primary" title="GnH瘤（FSH/LH瘤）" value="6">
                                <input type="checkbox" name="types" lay-skin="primary" title="未评估" value="7">
                            </div>
                        </div>
                    </div>
                    <div class="no-has-pituitary">
                        <div class="baseinfo-item">
                            <div class="layui-form-item">
                                <div class="layui-form-label">c.其他垂体疾病：</div>
                            </div>
                        </div>
                        <div class="baseinfo-item">
                            <div class="layui-form-item">
                                <input type="checkbox" name="types" value="11" lay-skin="primary" title="Rathke囊肿">
                                <input type="checkbox" name="types" value="12" lay-skin="primary" title="颅咽管瘤">
                                <input type="checkbox" name="types" value="13" lay-skin="primary" title="垂体柄阻断综合征">
                                <input type="checkbox" name="types" value="14" lay-skin="primary" title="淋巴细胞性垂体炎">
                                <input type="checkbox" name="types" value="15" lay-skin="primary" title="组织增生症">
                                <input type="checkbox" name="types" value="16" lay-skin="primary" title="生殖细胞瘤">
                                <input type="checkbox" name="types" value="17" lay-skin="primary" title="垂体柄增粗（病因未明）">
                            </div>
                        </div>
                    </div>
                    <div class="baseinfo-item-btn">
                        <button type="button" lay-submit="" lay-filter="submit-btn">提交</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <div class="fixed-container change-center-container">
        <div class="fixed-main">
            <div class="fixed-title">
                <p>修改手机</p>
                <i class="layui-icon layui-icon-close fixed-main-close"></i>
            </div>
            <div class="fixed-form">
                <form class="layui-form">
                    <div class="fixed-form-item">
                        <div class="layui-form-label">原手机号</div>
                        <div class="layui-input-inline">
                            <div class="layui-form-label old-cell">15203730120</div>
                        </div>
                    </div>
                    <div class="fixed-form-item">
                        <div class="layui-form-label">手机号</div>
                        <div class="layui-input-inline">
                            <input type="text" name="new_mobile" class="layui-input" placeholder="请输入新手机号">
                        </div>
                    </div>
                    <div class="fixed-form-item">
                        <div class="layui-form-label">验证码</div>
                        <div class="layui-input-inline">
                            <input type="text" name="new_mobile_code" placeholder="" class="layui-input">
                            <button type="button" class="layui-inline send-code" id="sendSms">点击获取</button>
                        </div>
                    </div>
                    <div class="fixed-form-item-confirm">
                        <button type="button" class="cancel-btn">取消</button>
                        <button style="background:#4777E7;color:white;" class="changeCellBtn" type="button">提交</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</body>
<script>
    var maxtime = 60;
    var timer;
    //更换手机号获取验证码
    function CountSendSms() {
        if (maxtime >= 0) {
            --maxtime;
            $("#sendSms").html(maxtime + '秒后获取');
            $("#sendSms").attr('disabled', true);
        } else {
            $("#sendSms").html('获取验证码');
            $("#sendSms").attr('disabled', false);
            clearInterval(timer);
        }
    }
    $(document).ready(function() {
        var height = $(window).height() - 2;
        $('.add-container').height(height - 39);
        //$('.container').height(height);
        getCompletion();

        window.onload = function() {
            var height = $(window).height() - 2;
            $('.add-container').height(height - 39);
            //$('.container').height(height);
            changeContainerHeight();
        }
        window.onresize = function() {
            //console.log('11')
            changeContainerHeight();
        }

        function changeContainerHeight() {
            var height = $(window).height() - 2;
            //$('.container').height(height);
            $('.add-container').height(height - 39);
        };



        layui.use(['element', 'form', 'layer', 'laydate', 'laypage'], function() {
            var element = layui.element;
            var form = layui.form;
            var layer = layui.layer;
            var laydate = layui.laydate;
            var laypage = layui.laypage;

            //允许最大时间
            var now = new Date();
            var year = parseInt(now.getFullYear());
            var month = parseInt(now.getMonth() + 1);
            var day = now.getDate();
            var max_date = year + '-' + month + '-' + day;
            //出生日期
            laydate.render({
                elem: '#bday',
                'max': max_date,
            });

            var patient_id = getLocalStorage('patient_id');
            console.log(patient_id);
            var patient_info = '';
            ajax_get(configUrl.patientInfo, {
                user_id: patient_id
            }, (res) => {
                console.log(res);
                patient_info = res.data;

                if (res.status == 0) {
                    $('input[name=user_id]').val(patient_info.user_id);
                    $('input[name=name]').val(patient_info.name);
                    $('input[name=sex]').val(patient_info.sex);
                    $('input[name=bday]').val(patient_info.bday);
                    $('input[name=ethnicity]').val(patient_info.ethnicity);
                    $('input[name=sfzid]').val(patient_info.sfzid);
                    $('input[name=ancestral_home]').val(patient_info.ancestral_home);
                    $('input[name=cell]').val(patient_info.cell);
                    $('.old-cell').text(patient_info.cell);
                    $('input[name=has_chuiti]').val(patient_info.has_chuiti);
                    $('input[name=family_like_has]').val(patient_info.family_like_has);
                    $('input[name=family_like_has_type_name]').val(patient_info.family_like_has_type_name);
                    if (patient_info.family_like_has == 0) {
                        $('.baseinfo-item .family_like_has:nth-child(2)').addClass('family_like_has_checked');
                        $('.baseinfo-item .family_like_has_type_name').hide();
                    } else {
                        $('.baseinfo-item .family_like_has:nth-child(1)').addClass('family_like_has_checked');
                        $('.baseinfo-item .family_like_has_type_name').show();
                    }
                    if (patient_info.sex == 0) {
                        $('.baseinfo-item .sex-checkbox:nth-child(1)').addClass('sex-btn-checked');
                        $('.baseinfo-item .sex-checkbox:nth-child(1)').siblings('button').removeClass('sex-btn-checked');
                    } else {
                        $('.baseinfo-item .sex-checkbox:nth-child(2)').addClass('sex-btn-checked');
                        $('.baseinfo-item .sex-checkbox:nth-child(2)').siblings('button').removeClass('sex-btn-checked');
                    };
                    if (patient_info.has_chuiti == 1) {
                        $('.has-pituitary').show();
                        $('.no-has-pituitary').hide();
                        $('.baseinfo-item .is_chuiti:nth-child(1)').addClass('is_chuiti_checked');
                        $('.baseinfo-item .is_chuiti:nth-child(1)').siblings('button').removeClass('is_chuiti_checked');
                        $.each(patient_info.types, function(index, item) {
                            $("input[name='types'][value='" + item + "']").attr('checked', true);
                            $("input[name='types'][value='" + item + "']").siblings().addClass('layui-form-checked');
                        })
                    } else if (patient_info.has_chuiti == 0) {
                        $('.has-pituitary').hide();
                        $('.no-has-pituitary').show();
                        $('.baseinfo-item .is_chuiti:nth-child(2)').addClass('is_chuiti_checked');
                        $('.baseinfo-item .is_chuiti:nth-child(2)').siblings('button').removeClass('is_chuiti_checked');
                        $.each(patient_info.types, function(index, item) {
                            $("input[name='types'][value='" + item + "']").attr('checked', true);
                            $("input[name='types'][value='" + item + "']").siblings().addClass('layui-form-checked');
                        })
                    };
                    /*$.each(patient_info.types,function(index,item){
                        $("input[name='types'][value='"+item+"']").attr('checked',true);
                        $("input[name='types'][value='"+item+"']").siblings().addClass('layui-form-checked');
                    })*/
                    $('input[name=name]').val(patient_info.name);
                    $('select[name=ethnicity]').val(patient_info.ethnicity);
                } else {
                    layer.msg(res.msg, {
                        icon: 5,
                        time: 1500
                    });
                    return false;
                }
                form.render();
            })

            //修改手机号
            $('#edit_mobile').click(function() {
                    $('.fixed-container').show();
                })
                //关闭修改手机
            $('.fixed-main-close').click(function() {
                $('.fixed-container').hide();
            })
            $('.cancel-btn').click(function() {
                $('.fixed-container').hide();
            })

            $('.send-code').click(function() {
                var mobile = $("input[name=new_mobile]").val();
                console.log(mobile);
                if (mobile == '') {
                    layer.msg('请输入手机号', {
                        icon: 5,
                        time: 1500
                    });
                    return false;
                }
                var loadindex = layer.load();
                ajax_post(configUrl.changeCellSendSms, {
                    cell: mobile
                }, (res) => {
                    layer.close(loadindex);
                    if (res.status == 0) {
                        layer.msg('发送成功', {
                            icon: 1,
                            time: 1000
                        }, function() {
                            timer2 = setInterval('CountSendSms()', 1000);
                        });
                    } else {
                        layer.msg(res.msg, {
                            icon: 5,
                            time: 1500
                        });
                    }
                })
            });

            //修改手机号确定
            $('.changeCellBtn').click(function() {
                var mobile = $("input[name=new_mobile]").val();
                var new_mobile_code = $("input[name=new_mobile_code]").val();
                if (mobile == '') {
                    layer.msg('请输入手机号', {
                        icon: 5,
                        time: 1500
                    });
                    return false;
                }
                if (new_mobile_code == '') {
                    layer.msg('请输入验证码', {
                        icon: 5,
                        time: 1500
                    });
                    return false;
                }
                var loadindex = layer.load();
                ajax_post(configUrl.patientChangeCell, {
                    mobile: mobile,
                    verify_code: new_mobile_code,
                    user_id: patient_id
                }, (res) => {
                    console.log(res);
                    layer.close(loadindex);
                    if (res.status == 0) {
                        layer.msg(res.msg, {
                            icon: 1,
                            time: 1000
                        }, function() {});
                    } else {
                        layer.msg(res.msg, {
                            icon: 5,
                            time: 1500
                        });
                    }
                })
            })

            $('.is_chuiti').click(function() {
                if ($(this).hasClass('is_chuiti_checked')) {
                    $(this).removeClass('is_chuiti_checked');
                    $(this).siblings('input').val('');
                    $('.has-pituitary').hide();
                    $('.no-has-pituitary').hide();
                    $('.has-pituitary input[name=types]').each(function() {
                        $(this).attr('checked', false);
                    })
                    $('.no-has-pituitary input[name=types]').each(function() {
                        $(this).attr('checked', false);
                    })
                } else {
                    $(this).addClass('is_chuiti_checked');
                    $(this).siblings().removeClass('is_chuiti_checked');
                    var value = $(this).attr('data-val');
                    $('input[name=has_chuiti]').val(value);
                    if (value == 1) {
                        $('.has-pituitary').show();
                        $('.no-has-pituitary').hide();
                        //把no-has-pituitary下的checkbox清空
                        $('.no-has-pituitary input[name=types]').each(function() {
                            $(this).prop('checked', false);
                        })
                    } else {
                        $('.has-pituitary').hide();
                        $('.no-has-pituitary').show();
                        //把has-pituitary下的checkbox清空
                        $('.has-pituitary input[name=types]').each(function() {
                            $(this).prop('checked', false);
                        })
                    }
                    form.render();
                }
            });

            $('.sex-btn').click(function() {
                if ($(this).hasClass('sex-btn-checked')) {
                    $(this).removeClass('sex-btn-checked')
                    $(this).siblings('input').val('');
                } else {
                    $(this).addClass('sex-btn-checked');
                    $(this).siblings().removeClass('sex-btn-checked');
                    var value = $(this).attr('data-val');
                    $(this).siblings('input').val(value);
                }
            });

            $('.family_like_has').click(function() {
                var value = $(this).attr('data-val');
                console.log(value)
                if ($(this).hasClass('family_like_has_checked')) {
                    $(this).removeClass('family_like_has_checked');
                    $(this).siblings('input').val('');
                    $('.family_like_has_type_name').hide();
                } else {
                    $(this).addClass('family_like_has_checked');
                    $(this).siblings().removeClass('family_like_has_checked');
                    var value = $(this).attr('data-val');
                    $('input[name=family_like_has]').val(value);
                    if (value == 1) {
                        $('.family_like_has_type_name').show();
                    } else {
                        $('.family_like_has_type_name').hide();
                        $('input[name=family_like_has_type_name]').val('');
                    }
                    form.render();
                }
            });

            form.on('submit(submit-btn)', function(data) {
                var params = data.field;
                var types = [];
                $('input[name=types]').each(function() {
                    var checked = $(this).prop('checked');
                    if (checked == true) {
                        types.push($(this).val());
                    }
                });
                //params.types = JSON.stringify(types);
                params.user_id = getLocalStorage('patient_id');
                console.log(params);
                var loadindex = layer.load();
                ajax_post(configUrl.patientSave, params, (res) => {
                    console.log(res);
                    layer.close(loadindex);
                    if (res.status == 0) {
                        ajax_post(configUrl.patientPituitary, {
                            has: params.has_chuiti,
                            types: types.join(','),
                            user_id: params.user_id
                        }, (res) => {
                            if (res.status == 0) {
                                layer.msg('提交成功', {
                                    icon: 1,
                                    time: 1000
                                }, function() {
                                    //window.location.reload();
                                    window.location.href = './qss/qss1.html';
                                });
                            } else {
                                layer.msg(res.msg, {
                                    icon: 5,
                                    time: 1500
                                });
                            }
                        })
                    } else {
                        layer.msg(res.msg, {
                            icon: 5,
                            time: 1500
                        });
                    }
                })
            });

            getRegion(form);

            function getRegion(form) {
                //获取地市
                ajax_get(configUrl.getRegion, '', (res) => {
                    $('.birthplace').empty();
                    var str = '<option value="">请选择</option>';
                    $('.birthplace').append(str);
                    $.each(res.data, function(index, item) {
                        var str2 = '<option value="' + item.id + '">' + item.name + '</option>';
                        if (patient_info.ancestral_home > 0) {
                            if (patient_info.ancestral_home == item.id) {
                                str2 = '<option value="' + item.id + '" selected>' + item.name + '</option>';
                            }
                        }
                        $('.birthplace').append(str2);
                    });
                    form.render();
                })
            }

        })
    })
</script>

</html>